{extend name='main'}

{block name="button"}
<button data-target-submit class='layui-btn layui-btn-sm'>{:lang('保存数据')}</button>
<button data-target-backup class="layui-btn layui-btn-sm layui-btn-danger">{:lang('取消编辑')}</button>
{/block}

{block name="content"}
<div class="think-box-shadow">
    <form action="{:sysuri()}" method="post" data-auto="true" class="layui-form layui-card" data-table-id="BaseTable">
        <div class="layui-card-body">
            <fieldset class="layui-elem-field">
                <legend>授课信息</legend>
                <div class="layui-row layui-col-space10 layui-field-box">
                    {notempty name='tree'}
                    {foreach $tree as $k=>$v}
                    <div class="layui-col-xs6">
                        <div class="layui-form-item">
                            <div class="help-label"><b>{$v.name}</b></div>
                            <div class="layui-textarea help-checks">
                                {foreach $v.children as $c}
                                <label class="think-checkbox">
                                    {if in_array($c.id, explode(',',$vo.lesson_item?? ''))}
                                    <input type="checkbox" checked name="lesson_item[]" value="{$c.id}" lay-ignore>{$c.name}
                                    {else}
                                    <input type="checkbox" name="lesson_item[]" value="{$c.id}" lay-ignore>{$c.name}
                                    {/if}
                                </label>
                                {/foreach}
                            </div>
                        </div>
                    </div>
                    {/foreach}
                    {/notempty}

                    <div class="layui-col-xs6">
                        <div class="layui-form-item">
                            <label class="relative block">
                                <span class="color-green font-w7">选择省份</span>
                                <span class="color-desc margin-left-5"></span>
                                <select lay-filter="province" required name="lesson_province" class="layui-select">
                                    <option value="">请选择</option>
                                </select>
                            </label>
                        </div>
                    </div>
                    <div class="layui-col-xs6">
                        <div class="layui-form-item">
                            <label class="relative block">
                                <span class="color-green font-w7">选择城市</span>
                                <span class="color-desc margin-left-5"></span>
                                <select lay-filter="city" required name="lesson_city" class="layui-select">
                                    <option value="">请选择</option>
                                </select>
                            </label>
                        </div>
                    </div>
                    <div class="layui-col-xs12">
                        <div class="layui-form-item">
                            <div class="help-label"><b>选择区</b></div>
                            <div class="layui-textarea help-checks" id="district"></div>
                        </div>
                    </div>
                    <div class="layui-col-xs4">
                        <div class="layui-form-item">
                            <div class="help-label"><b>授课场地</b></div>
                            <div class="layui-textarea help-checks">
                                {foreach ["1"=>'上门服务',"2"=>"指定场地","3"=>"双方协商"] as $k=>$v}
                                <label class="think-checkbox">
                                    {if in_array($k, explode(',',$vo.lesson_room?? ''))}
                                    <input type="checkbox" checked name="lesson_room[]" value="{$k}" lay-ignore>{$v}
                                    {else}
                                    <input type="checkbox" name="lesson_room[]" value="{$k}" lay-ignore>{$v}
                                    {/if}
                                </label>
                                {/foreach}
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="layui-form-item relative block">
                            <span class="help-label"><b>年龄要求</b></span>
                            <input type="hidden" name="age_min" value="{$vo.age_min|default='18'}">
                            <input type="hidden" name="age_max" value="{$vo.age_max|default='60'}">
                            <div id="age-range" class="margin-10"></div>
                            <!--<div class="layui-input-group">
                                <div class="layui-input-prefix">
                                    <input type="number"  name="age_min" required vali-name="年龄要求最小值" class="layui-input" placeholder="年龄要求最小值" />
                                </div>
                                <input type="number"  name="age_max" required vali-name="年龄要求最大值" class="layui-input" placeholder="年龄要求最大值" />
                            </div>-->
                            <span class="help-block" id="age_tips">当前年龄要求：{$vo.age_min|default="18"} - {$vo.age_max|default="60"}</span>
                        </div>
                    </div>
                    <div class="layui-col-xs2">
                        <div class="layui-form-item">
                            <label class="relative block">
                                <span class="color-green font-w7"><b>从业时间</b></span>
                                <span class="color-desc margin-left-5"></span>
                                <input type="text" class="layui-input" required data-year-input name="working_year" value='{$vo.working_year|default=""}' placeholder="请输入从业时间"  id="laydate-type-year">
                            </label>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>课时费用</b>（元起 / 课时）</span>
                            <input type="number" min="0"  class="layui-input" name="lesson_price" value='{$vo.lesson_price|default=""}' required
                                   vali-name="课时费用" placeholder="课时费用" required>
                            <span class="help-block"></span>
                        </label>
                    </div>
                </div>
            </fieldset>

            <fieldset class="layui-elem-field">
                <legend>个人资料</legend>
                <div class="layui-row layui-col-space10 layui-field-box">
                    <div class="layui-col-xs4">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>姓名</b></span>
                            <input type="text" class="layui-input" required name="name" value="{$vo.name|default=''}" placeholder="请输入姓名">
                        </label>
                    </div>
                    <div class="layui-col-xs2">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>出生日期</b></span>
                            <input type="text" data-date-input class="layui-input" required name="birthday" value="{$vo.birthday|default=''}" placeholder="请输入出生日期">
                        </label>
                    </div>
                    <div class="layui-col-xs2">
                        <div class="layui-form-item">
                            <span class="block color-green font-w7">性别</span>
                            <div class="layui-input help-checks">
                                {foreach [['title'=>'男','value'=>1,'is_default'=>0],['title'=>'女','value'=>0,'is_default'=>1]] as $v }
                                {if isset($vo.gender) && $vo.gender==$v.value || $v.is_default==1 && !isset($vo.gender) }
                                <input type="radio" name="gender" checked title="{$v.title}" value="{$v.value}">
                                {else /}<input type="radio" name="gender" title="{$v.title}" value="{$v.value}">
                                {/if}
                                {/foreach}
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs2">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>身高</b>CM</span>
                            <input type="number" min="50" max="255" class="layui-input" name="height" value='{$vo.height|default=""}' required vali-name="身高" placeholder="请输入身高" />
                        </label>
                    </div>
                    <div class="layui-col-xs2">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>体重</b>KG</span>
                            <input type="number" min="10" max="300" class="layui-input" name="weight" value='{$vo.weight|default=""}' required vali-name="体重" placeholder="请输入体重" />
                        </label>
                    </div>
                    <div class="layui-col-xs1">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>头像</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.avatar|default=''}" name="avatar">
                            </div>
                            <script>$('[name=avatar]').uploadOneImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs1">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>微信名片</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.business_card|default=''}" name="business_card">
                            </div>
                            <script>$('[name=business_card]').uploadOneImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs10">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>个人形象照片</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.photo|default=''}" name="photo">
                            </div>
                            <script>$('[name=photo]').uploadMultipleImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs2">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>电话</b></span>
                            <input type="text" class="layui-input" lay-verify="required|phone" required name="mobile" value="{$vo.mobile|default=''}" placeholder="请输入电话">
                        </label>
                    </div>
                    <div class="layui-col-xs10">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>常驻地点</b></span>
                            <input type="text" class="layui-input" lay-verify="required" required name="address" value="{$vo.address|default=''}" placeholder="请输入常驻地点">
                        </label>
                    </div>
                </div>
            </fieldset>

            <fieldset class="layui-elem-field">
                <legend>个人资质</legend>
                <div class="layui-row layui-col-space10 layui-field-box">
                    <div class="layui-col-xs12">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>毕业院校</b></span>
                            <input type="text" class="layui-input" maxlength="150" required name="school" value="{$vo.school|default=''}" placeholder="请输入毕业院校">
                        </label>
                    </div>
                    <div class="layui-col-xs1">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>资格证</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.teacher_cert|default=''}" name="teacher_cert">
                            </div>
                            <script>$('[name=teacher_cert]').uploadOneImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs1">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>资质证书</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.certification|default=''}" name="certification">
                            </div>
                            <script>$('[name=certification]').uploadOneImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs10">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>荣誉证书</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.honor|default=''}" name="honor">
                            </div>
                            <script>$('[name=honor]').uploadMultipleImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs6">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>简介</b></span>
                            <textarea required placeholder="请输入简介" rows="10" class="layui-textarea" name="introduce">{$vo.introduce|default=""}</textarea>
                        </label>
                    </div>
                    <div class="layui-col-xs6">
                        <label class="layui-form-item relative block">
                            <span class="help-label"><b>成绩</b></span>
                            <textarea required placeholder="请输入成绩" rows="10" class="layui-textarea" name="achievement">{$vo.achievement|default=""}</textarea>
                        </label>
                    </div>
                </div>
            </fieldset>
            <fieldset class="layui-elem-field">
                <legend>入驻申请</legend>
                <div class="layui-row layui-col-space10 layui-field-box">
                    <div class="layui-col-xs6">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>身份证人像正面</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.idcard_front|default=''}" name="idcard_front">
                            </div>
                            <script>$('[name=idcard_front]').uploadOneImage();</script>
                        </div>
                    </div>
                    <div class="layui-col-xs6">
                        <div class="layui-form-item margin-bottom-5">
                            <div class="help-label"><b>身份证国徽反面照</b></div>
                            <div class="layui-textarea help-images">
                                <input type="hidden" value="{$vo.idcard_back|default=''}" name="idcard_back">
                            </div>
                            <script>$('[name=idcard_back]').uploadOneImage();</script>
                        </div>
                    </div>
                </div>
            </fieldset>




            <div class="hr-line-dashed"></div>
            {notempty name='vo.id'}<input name="id" value="{$vo.id}" type="hidden"/>{/notempty}
            <input name="spm" value="{$get.spm|default=''}" type="hidden"/>
            <div class="layui-form-item text-center">
                <button  class="layui-btn"  lay-submit lay-filter="save-data">{:lang('保存数据')}</button>
                <button data-target-backup class="layui-btn layui-btn-danger" type="button">{:lang('取消编辑')}</button>
            </div>
        </div>
    </form>
</div>

<script>
layui.use(['form','slider'], function(){
    const province_id = '{$city.parent_code|default=""}';
    const city_id = '{$city.code|default=""}';
    const district_id = '{$vo.lesson_district|default=""}';
    $.ajax({
        'url': '/admin/coach/region',
        'type': 'post',
        'data': {parent_code: null},
        success: function (res) {
            let str = '<option value="">--请选择--</option>';
            $.each(res.data, function (i, s) {
                if (s.code === province_id) {
                    str += '<option selected value="' + s.code + '">' + s.name + '</option>';
                } else {
                    str += '<option value="' + s.code + '">' + s.name + '</option>';
                }
            })
            $('select[name="lesson_province"]').html(str);
            window.form.render('select');
        },
        error: function (res) {
        }
    })
    if (province_id) {
        $.ajax({
            'url': '/admin/coach/region',
            'type': 'post',
            'data': {parent_code: province_id},
            success: function (res) {
                let str = '<option value="">--请选择--</option>';
                $.each(res.data, function (i, s) {
                    if (s.code === city_id) {
                        str += '<option selected value="' + s.code + '">' + s.name + '</option>';
                    } else {
                        str += '<option value="' + s.code + '">' + s.name + '</option>';
                    }
                })
                $('select[name="lesson_city"]').html(str);
                window.form.render('select');
            },
            error: function (res) {
            }
        });
    }
    if (city_id) {
        $.ajax({
            url: '/admin/coach/region',
            type: 'post',
            data: {parent_code: city_id},
            success: function (res) {
                let str = '';
                const arr=district_id.split(',');
                $.each(res.data, function (i, s) {
                    str+='<label class="think-checkbox">';
                    if (arr.some(item=>item===s.code)) {
                        str += `<input type="checkbox" checked name="lesson_district[]" value="${s.code}" lay-ignore>${s.name}`;
                    } else {
                        str += `<input type="checkbox" name="lesson_district[]" value="${s.code}" lay-ignore>${s.name}`;
                    }
                    str+='</label>';
                })
                $('#district').html(str);
                window.form.render('checkbox');
            },
            error: function (res) {
            }
        });
    }
    form.on("select(province)",function (data) {
        if(data.value===''){
            var str ='<option value="">请选择</option>';
            $('select[name="lesson_city"]').html(str);
            window.form.render('select');
            $('#district').html('请先选择城市');
            window.form.render('checkbox');
            return false;
        }
        $.ajax({
            'url':'/admin/coach/region',
            data: {parent_code: data.value},
            success:function (res) {
                let str = '<option value="">--请选择--</option>';
                $.each(res.data, function (i, s) {
                    if (s.code === city_id) {
                        str += '<option selected value="' + s.code + '">' + s.name + '</option>';
                    } else {
                        str += '<option value="' + s.code + '">' + s.name + '</option>';
                    }
                })
                $('select[name="lesson_city"]').html(str);
                window.form.render('select');
                $('#district').html('请先选择城市');
                window.form.render('checkbox');
            },
            error:function (res) {
            }
        })
    })
    form.on("select(city)",function (data) {
        if(data.value===''){
            $('#district').html('请先选择城市');
            window.form.render('checkbox');
            return false;
        }
        $.ajax({
            'url':'/admin/coach/region',
            data: {parent_code: data.value},
            success:function (res) {
                let str = '';
                const arr=district_id.split(',');
                $.each(res.data, function (i, s) {
                    str+='<label class="think-checkbox">';
                    if (arr.some(item=>item===s.code)) {
                        str += `<input type="checkbox" checked name="lesson_district[]" value="${s.code}" lay-ignore>${s.name}`;
                    } else {
                        str += `<input type="checkbox" name="lesson_district[]" value="${s.code}" lay-ignore>${s.name}`;
                    }
                    str+='</label>';
                })
                $('#district').html(str);
                window.form.render('checkbox');
            },
            error:function (res) {
            }
        })
    })

    //年龄滑块
    let slider = layui.slider;
    slider.render({
        elem: '#age-range',
        value:[parseInt('{$vo.age_min|default="0"}'),parseInt('{$vo.age_max|default="0"}')],//初始值
        range:true,//开启范围选择
        min:0,
        max:100,
        tips: true, // 开启提示文本
        tipsAlways: true, // 开启始终显示提示文本
        change: function(value){
            $('[name=age_min]').val(value[0]);
            $('[name=age_max]').val(value[1]);
            $("#age_tips").html(`当前年龄要求：${value[0]} - ${value[1]}`);
        }
    });

    // 提交事件
    form.on('submit(save-data)', function (data) {
        var field = data.field; // 获取表单字段值
        console.log(field);
        if (!field.photo) {
            layer.msg('请上传个人形象图片');
            return false; // 阻止默认 form 跳转
        }
        return true; // 阻止默认 form 跳转
    });



});

</script>
{/block}

